<template>
  <div class="app-container">
    <!-- ****************************** -->
    <el-row :gutter="20" class="header" style="margin-left: 0">
      <div class="prompt">
        <h1>工作提示卡</h1>
        <div class="prompt-main">
          <el-col
            :span="6"
            v-for="item in orderTypeStatistics"
            :key="item.type"
          >
            <div>
              <p class="text1">{{ item.count }}</p>
              <h2>{{ item.type }}</h2>
            </div>
          </el-col>
          <div class="vertical-line"></div>
        </div>
      </div>
      <!-- <div class="searchForm"> -->
      <el-form
        :model="queryParams"
        ref="queryForm"
        size="small"
        :inline="true"
        v-show="showSearch"
      >
        <el-form-item label="工单类型" prop="type">
          <el-select
            v-model="queryParams.type"
            placeholder="请选择工单类型"
            clearable
          >
            <el-option
              v-for="dict in dict.type.outfield_type"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="工单状态" prop="state">
          <el-select
            v-model="queryParams.state"
            placeholder="请选择工单状态"
            clearable
          >
            <el-option
              v-for="dict in dict.type.outfield_state"
              :key="dict.value"
              :label="dict.label"
              :value="dict.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="日期">
          <el-date-picker
            v-model="dateRange"
            style="width: 240px"
            value-format="yyyy-MM-dd HH:mm:ss.00"
            type="daterange"
            range-separator="-"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          ></el-date-picker>
        </el-form-item>
        <el-form-item label="航班号" prop="flightNumber">
          <el-input
            v-model="queryParams.flightNumber"
            placeholder=""
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="机号" prop="machineNumber">
          <el-input
            v-model="queryParams.machineNumber"
            placeholder=""
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item label="停机位" prop="stand">
          <el-input
            v-model="queryParams.stand"
            placeholder=""
            clearable
            @keyup.enter.native="handleQuery"
          />
        </el-form-item>
        <el-form-item class="header-button">
          <el-button
            type="primary"
            icon="el-icon-search"
            size="mini"
            @click="handleQuery"
            >查询</el-button
          >
          <el-button
            type="warning"
            plain
            icon="el-icon-download"
            size="mini"
            @click="handleExport"
            v-hasPermi="['monitor:logininfor:export']"
            >导出</el-button
          >
          <el-button
            type="primary"
            plain
            icon="el-icon-plus"
            size="mini"
            @click="handleAddField"
            >增加</el-button
          >
        </el-form-item>
      </el-form>
      <!-- </div> -->
    </el-row>

    <!-- ***************数据列表*************** -->
    <el-table
      v-if="refreshTable"
      v-loading="loading"
      :data="menuList"
      row-key="menuId"
      :default-expand-all="isExpandAll"
      :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      style="width: 100%"
    >
      <el-table-column prop="id" label="序号" align="center"></el-table-column>
      <el-table-column
        prop="type"
        label="工单类型"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="createTime"
        label="日期"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="flightNumber"
        label="航班号"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="machineNumber"
        label="机号"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="stand"
        label="停机位"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="state"
        label="工作状态"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="worker"
        label="工作者"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="reviewer"
        label="复核者"
        align="center"
      ></el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="goToDetail(scope.row)"
            v-hasPermi="['monitor:operlog:query']"
            >详情</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-view"
            @click="toEdit(scope.row)"
            >编辑</el-button
          >
          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:menu:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!-- 尾部分页 -->
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
    />

    <!-- 表单弹窗 接机start -->
    <el-dialog
      v-if="open"
      :title="dialogTitle"
      :visible.sync="open"
      width="700px"
      append-to-body
      :before-close="dialogClose"
      v-model="form"
    >
      <el-form>
        <div style="margin: 16px; font-size: 16px">
          <div class="row">
            1.清点所携带工具(若是工具包或工具箱,则均含清单中所列工具)。
          </div>
          <div class="row">
            C1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c1" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >工具包</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="4" style="margin-right: 12px" shape="square"
                  >指挥棒</el-checkbox
                >
                <el-checkbox label="5" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c1other }}</el-checkbox
                >
              </el-checkbox-group>

              <el-input
                v-model="form.jcc1other"
                v-show="form.jcc15"
                name="其他"
                placeholder="其他"
                :rules="[{ required: true, message: '请填写其他' }]"
              />
            </div>
          </div>
          <div class="row">
            C2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c2" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >工具包</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="4" style="margin-right: 12px" shape="square"
                  >指挥棒</el-checkbox
                >
                <el-checkbox label="5" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c2other }}</el-checkbox
                >
              </el-checkbox-group>
              <el-input
                v-model="form.jcc2other"
                v-show="form.jcc25"
                name="其他"
                placeholder="其他"
                :rules="[{ required: true, message: '请填写其他' }]"
              />
            </div>
          </div>

          <div v-if="index7">
            <div class="row">2.机位线确认。</div>
            <div class="row">
              C1：
              <div class="row">
                辨认地面机位线标识，确认机型为<span style="color: #088fea">
                  {{ detailForm.c5 ? detailForm.c5 : "________" }}
                </span>
                后放置轮档于停机线左侧。
              </div>
            </div>

            <div class="row">
              C2：
              <div class="row">
                复核轮档放置位置为正确机型的停机线左侧。
                <el-checkbox-group v-model="detailForm.c6" disabled>
                  <el-checkbox label="1">是</el-checkbox>
                  <el-checkbox label="2" style="margin-left: 10px"
                    >否</el-checkbox
                  >
                </el-checkbox-group>
              </div>
              <el-image
                style="width: 66px; height: 66px"
                :src="detailForm.url"
                :zoom-rate="1.2"
                :preview-src-list="detailForm.srcList"
                :initial-index="0"
                fit="cover"
                :preview-teleported="true"
              >
                <div slot="error" class="image-slot">暂无图片</div>
              </el-image>
            </div>
          </div>

          <div class="row">3.对机位适用性检查</div>
          <el-checkbox-group v-model="detailForm.d1" disabled>
            <el-checkbox label="1" style="margin-right: 12px" shape="square"
              >滑行线路及机位周围无障碍物,地面整洁无杂物。</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >轮挡及警示锥完好。</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >灭火设备正常。</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >廊桥在回归点。</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >设备摆放区内牵引杆、工作梯及櫲胶轮挡等摆放整齐。</el-checkbox
            >
          </el-checkbox-group>

          <div class="row">4.离开时清点工具与第1条所携带的工具一致。</div>
          <el-checkbox-group v-model="detailForm.d3" disabled>
            <el-checkbox label="1" style="margin-right: 12px" shape="square"
              >是</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >否</el-checkbox
            >
          </el-checkbox-group>
          <div class="row">
            C1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c3" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c3other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
          <div class="row">
            C2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c4" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c4other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
        </div>
        <div class="row">
          工作者：
          <el-input
            v-model="detailForm.n2"
            name="n1"
            disabled
            placeholder="请输入工作者"
          />
        </div>
        <div class="row">
          审核者：
          <el-input
            v-model="detailForm.n1"
            name="n2"
            disabled
            placeholder="-"
          />
        </div>
      </el-form>
    </el-dialog>

    <!-- 表单弹窗 送机start -->
    <el-dialog
      :title="dialogTitle"
      :visible.sync="open2"
      width="700px"
      append-to-body
      :before-close="dialogClose"
      v-model="form"
    >
      <el-form>
        <div style="margin: 16px; font-size: 16px">
          <div class="row">
            1.送机人员在接到上客通知后到达指定机位,清点所携带工具。
          </div>

          <div class="row">
            S1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c1" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >工具包(含清单所列工具)</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="5" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c1other }}</el-checkbox
                >
                <el-input
                  v-model="form.jcc1other"
                  v-if="form.jcc15"
                  name="其他"
                  placeholder="其他"
                  :rules="[{ required: true, message: '请填写其他' }]"
                />
              </el-checkbox-group>
            </div>
          </div>

          <div class="row">
            S2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c2" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >工具包(含清单所列工具)</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="4" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c2other }}</el-checkbox
                >
                <el-input
                  v-model="form.jcc1other"
                  v-if="form.jcc15"
                  name="其他"
                  placeholder="其他"
                  :rules="[{ required: true, message: '请填写其他' }]"
                />
              </el-checkbox-group>
            </div>
          </div>

          <div class="row">
            2.淮备耳机,建立空地通话,确认耳机工作正常。视情插好转弯旁通销{{
              detailForm.boatNameInspect
            }}(旁通销类型),挂好拖把。
          </div>

          <el-input
            v-model="detailForm.boatNameInspect"
            name="用户名"
            placeholder="请输入通销类型"
            disabled
          />
          <div class="row">
            3.航前及排故飞杌需确认各堵头、起落架安全销等已取净。
          </div>

          <div class="row">
            C1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c3" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >航前</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >排故</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >短停</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>

          <div class="row">4.发动机启动完毕后,取下耳机,盖好盖板。</div>

          <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
            <el-checkbox-group v-model="detailForm.d4" disabled>
              <el-checkbox label="1" style="margin-right: 12px" shape="square"
                >是</el-checkbox
              >
              <el-checkbox label="2" style="margin-right: 12px" shape="square"
                >否</el-checkbox
              >
            </el-checkbox-group>
          </div>

          <div class="row">
            5.送机结束后,离开时清点工具与第1条所携带的一致。
          </div>

          <div class="row">
            S1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c4" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c4other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
          <div class="row">
            S2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c5" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c5other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
        </div>
        <div class="row">
          工作者：
          <el-input
            v-model="detailForm.n2"
            name="n1"
            disabled
            placeholder="请输入工作者"
          />
        </div>
        <div class="row">
          审核者：
          <el-input
            v-model="detailForm.n1"
            name="n2"
            disabled
            placeholder="-"
          />
        </div>
      </el-form>
    </el-dialog>

    <!-- 表单弹窗 维修start -->
    <el-dialog
      :title="dialogTitle"
      :visible.sync="open3"
      width="700px"
      append-to-body
      :before-close="dialogClose"
      v-model="form"
    >
      <el-form>
        <div style="margin: 16px; font-size: 16px">
          <div class="row">
            1.维修/放行人员开始维修检查和整机放行前,清点所携带的工具。
          </div>

          <div class="row">
            Q1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c1" disabled>
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="5" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c1other }}</el-checkbox
                >
                <el-input
                  v-model="form.jcc1other"
                  v-show="form.jcc15"
                  name="其他"
                  placeholder="其他"
                  :rules="[{ required: true, message: '请填写其他' }]"
                />
              </el-checkbox-group>
            </div>
          </div>

          <div class="row">
            Q2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c2" disabled>
                <el-checkbox label="2" style="margin-right: 12px" shape="square"
                  >对讲机</el-checkbox
                >
                <el-checkbox label="3" style="margin-right: 12px" shape="square"
                  >手电筒</el-checkbox
                >
                <el-checkbox label="5" style="margin-right: 12px" shape="square"
                  >其他&nbsp;{{ this.detailForm.c2other }}</el-checkbox
                >
                <el-input
                  v-model="form.jcc1other"
                  v-show="form.jcc15"
                  name="其他"
                  placeholder="其他"
                  :rules="[{ required: true, message: '请填写其他' }]"
                />
              </el-checkbox-group>
            </div>
          </div>
          <div class="row">2.飞行/技术/客舱记录本已签署,并将航站页留存。</div>
          <el-checkbox-group v-model="detailForm.d1" disabled>
            <el-checkbox label="1" style="margin-right: 12px" shape="square"
              >是</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >否</el-checkbox
            >
          </el-checkbox-group>

          <div class="row">
            3.加注油液前确认牌号是否正确(油液牌号:{{
              detailForm.boatNameInspect
            }})。若加注滑油时,工作完成后盖好滑油口盖。
          </div>
          <el-input
            v-model="detailForm.boatNameInspect"
            name="用户名"
            placeholder="请输入油液牌号"
            :rules="[{ required: true, message: '请填写油液牌号' }]"
            disabled
          />
          <div class="row">
            4.航前及排故飞机起落架安全销、堵头、跳开关夹等取净。
          </div>
          <el-checkbox-group v-model="detailForm.d2" disabled>
            <el-checkbox label="1" style="margin-right: 12px" shape="square"
              >是</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >不适用</el-checkbox
            >
          </el-checkbox-group>
          <div class="row">5.开启客舱门时应急滑梯解除预位</div>
          <el-checkbox-group v-model="detailForm.d3" disabled>
            <el-checkbox label="1" style="margin-right: 12px" shape="square"
              >是</el-checkbox
            >
            <el-checkbox label="2" style="margin-right: 12px" shape="square"
              >不适用</el-checkbox
            >
          </el-checkbox-group>

          <div class="row">
            6.维修人员/放行人员工作结東后,清点所携带的工具(与第1条一致)。
          </div>
          <div class="row">
            Q1：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c3" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="0" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c3other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
          <div class="row">
            Q2：
            <div style="display: flex; flex-wrap: wrap; margin-top: 4px">
              <el-checkbox-group v-model="detailForm.c4" disabled>
                <el-checkbox label="1" style="margin-right: 12px" shape="square"
                  >一致</el-checkbox
                >
                <el-checkbox label="0" style="margin-right: 12px" shape="square"
                  >不一致&nbsp;{{ this.detailForm.c4other }}</el-checkbox
                >
              </el-checkbox-group>
            </div>
          </div>
        </div>
        <div class="row">
          工作者：
          <el-input
            v-model="detailForm.n2"
            name="n1"
            disabled
            placeholder="请输入工作者"
          />
        </div>
        <div class="row">
          审核者：
          <el-input
            v-model="detailForm.n1"
            name="n2"
            disabled
            placeholder="-"
          />
        </div>
      </el-form>
    </el-dialog>

    <!-- 表单弹窗 长短停start -->
    <el-dialog
      :title="dialogTitle"
      :visible.sync="open4"
      width="700px"
      append-to-body
      :before-close="dialogClose"
      v-model="form"
    >
      <el-form>
        <div style="margin: 16px; font-size: 16px">
          <div class="row">1.检查并确认ADRU电门在OFF位</div>

          <el-radio-group v-model="radio1" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">2.检查并确认应急灯选择电门在OFF位。</div>

          <el-radio-group v-model="radio2" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">
            3.检查并确认机组氧气系统ON灯不亮(空客系列飞机)。
          </div>

          <el-radio-group v-model="radio3" direction="horizontal" disabled>
            <el-radio label="1">不适用</el-radio>
            <el-radio label="2" style="margin-left: 10px">是</el-radio>
            <el-radio label="3" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">4.检查并确认空调组件关闭。</div>

          <el-radio-group v-model="radio4" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">5.检查并确认APU引气关闭。</div>

          <el-radio-group v-model="radio5" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">6.检查并确认APU主电门关闭。</div>

          <el-radio-group v-model="radio6" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">7.检查并确认:A330APU电瓶关闭。</div>

          <el-radio-group v-model="radio7" direction="horizontal" disabled>
            <el-radio label="1">不适用</el-radio>
            <el-radio label="2" style="margin-left: 10px">是</el-radio>
            <el-radio label="3" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">8.检查并确认主电瓶关闭。</div>

          <el-radio-group v-model="radio8" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">9.检查并确认飞机各舱门、窗户关闭。</div>

          <el-radio-group v-model="radio9" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>

          <div class="row">10.清点工具。</div>
          <el-radio-group v-model="radio10" direction="horizontal" disabled>
            <el-radio label="1">是</el-radio>
            <el-radio label="2" style="margin-left: 10px">否</el-radio>
          </el-radio-group>
        </div>
        <div class="row">
          工作者：
          <el-input
            v-model="detailForm.n2"
            name="n1"
            disabled
            placeholder="请输入工作者"
          />
        </div>
        <div class="row">
          审核者：
          <el-input
            v-model="detailForm.n1"
            name="n2"
            disabled
            placeholder="-"
          />
        </div>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import IconSelect from "@/components/IconSelect";
import {
  orderList,
  orderTypeStatistics,
  deleteOrder,
  queryById,
} from "@/api/system/order";
import { downloadExcel } from "@/api/download";

export default {
  name: "Menu",
  dicts: ["sys_show_hide", "outfield_type", "outfield_state"],
  components: { Treeselect, IconSelect },
  data() {
    return {
      /* 日期 start*/
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            },
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            },
          },
        ],
      },
      /* 日期 end*/
      // 日期范围
      dateRange: [],
      // 遮罩层
      loading: false,
      // 显示搜索条件
      showSearch: true,
      // 菜单表格树数据
      menuList: [],
      // 菜单树选项
      menuOptions: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      open2: false,
      open3: false,
      open4: false,
      // 是否展开，默认全部折叠
      isExpandAll: false,
      // 重新渲染表格状态
      refreshTable: true,
      // 总条数
      total: 0,
      //工单类型统计
      orderTypeStatistics: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        flightNumber: "",
        machineNumber: "",
        stand: "",
        // type: 1,
        // state: 1,
        startTime: "",
        endTime: "",
      },
      // 表单参数
      form: {},
      dialogTitle: "",
      // 弹出框参数
      detailForm: {
        boatNameInspect: "",

        d1: "",
        d2: "",
        d3: "",
        d4: [],

        c1: [],
        c1other: "",

        c2: [],
        c2other: "",

        c3: [],
        c3other: "",

        c4: [],
        c4other: "",

        c5: [],
        c5other: "",

        time: "",

        n1: "",
        n2: "",
      },
      radio1: "",
      radio2: "",
      radio3: "",
      radio4: "",
      radio5: "",
      radio6: "",
      radio7: "",
      radio8: "",
      radio9: "",
      radio10: "",

      index7: true,
    };
  },
  created() {
    this.getList();
    this.getOrderTypeStatistics();
  },
  activated() {
    this.getList();
    this.getOrderTypeStatistics();
  },
  methods: {
    toEdit(values) {
    
      if (values.type === '接机工作') {
        this.$router.push({
           path: "/user/selectSF",
          query: { id: values.id, source: "edit", type: 1 },
        });
      }
      if (values.type === "送机工作") {
        this.$router.push({
           path: "/user/selectSF",
          query: { id: values.id, source: "edit", type: 2 },
        });
      }
      if (values.type === "维修检查") {
        this.$router.push({
            path: "/user/selectSF",
          query: { id: values.id, source: "edit", type: 3 },
        });
      }
      if (values.type === "长短停及航后离机检查项目") {
        this.$router.push({
          path: "/user/selectSF",
          query: { id: values.id, source: "edit", type: 4 },
        });
      }
    },

    handleAddField() {
      this.$router.push({
        path: "/user/addInfield",
      });
    },
    /** 查询菜单列表 */
    getList() {
      this.loading = true;
      /*start 请求数据转换*/
      this.queryParams.startTime = this.dateRange[0];
      this.queryParams.endTime = this.dateRange[1];
      if (this.queryParams.type == 0) {
        this.queryParams.type = "";
      }
      if (this.queryParams.state == 0) {
        this.queryParams.state = "";
      }

      orderList(this.queryParams).then((response) => {
        this.total = response.data.total;
        this.menuList = this.handleTree(response.data.records, "id");

        //工单类型、状态转换
        for (const i in this.menuList) {
          if (this.menuList[i].state === 1) {
            this.menuList[i].state = "待检查";
          }
          if (this.menuList[i].state === 2) {
            this.menuList[i].state = "待复核";
          }
          if (this.menuList[i].state === 3) {
            this.menuList[i].state = "已完成";
          }
          if (this.menuList[i].state === 4) {
            this.menuList[i].state = "废弃";
          }
          if (this.menuList[i].type === 1) {
            this.menuList[i].type = "接机工作";
          }
          if (this.menuList[i].type === 2) {
            this.menuList[i].type = "送机工作";
          }
          if (this.menuList[i].type === 3) {
            this.menuList[i].type = "维修检查";
          }
          if (this.menuList[i].type === 4) {
            this.menuList[i].type = "长短停及航后离机检查项目";
          }
        }
        this.loading = false;
      });
    },
    //查询工单类型统计
    getOrderTypeStatistics() {
      orderTypeStatistics().then((response) => {
        this.orderTypeStatistics = response.data;
        // 数据转换
        for (const i in this.orderTypeStatistics) {
          if (this.orderTypeStatistics[i].type === 1) {
            this.orderTypeStatistics[i].type = "接机工作";
          }
          if (this.orderTypeStatistics[i].type === 2) {
            this.orderTypeStatistics[i].type = "送机工作";
          }
          if (this.orderTypeStatistics[i].type === 3) {
            this.orderTypeStatistics[i].type = "维修检查";
          }
          if (this.orderTypeStatistics[i].type === 4) {
            this.orderTypeStatistics[i].type = "长短停及航后离机检查项目";
          }
        }
      });
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      this.$modal
        .confirm('是否确认删除ID为"' + row.id + '"的数据项？')
        .then(function () {
          console.log(row.id);
          return deleteOrder(row.id);
        })
        .then(() => {
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => {});
    },
    /** 导出按钮操作 */
    handleExport() {
      downloadExcel(
        "/outfield-vehicle-equipment-inspect/export",
        `外场工单_${new Date().getTime()}.xlsx`,
        {
          ...this.queryParams,
        },
        "post"
      );
    },
    // 查看详情页
    goToDetail(item) {
      this.dialogTitle = `序号为 ${item.id} 的工单详情`;
      if (item.type === "接机工作") {
        this.open = true;
      } else if (item.type === "送机工作") {
        this.open2 = true;
      } else if (item.type === "维修检查") {
        this.open3 = true;
      } else if (item.type === "长短停及航后离机检查项目") {
        this.open4 = true;
      }
      queryById({ id: item.id }).then((res) => {
        this.form = res.data;
        this.detailForm.n1 = this.form.reviewer;
        this.detailForm.n2 = this.form.worker;
        if (item.type === "长短停及航后离机检查项目") {
          const workerInspectTerm = res.data?.inspectTimestamp
            ? res.data.inspectTimestamp
            : 0;
          const reviewerInspectTerm = res.data?.reviewerTimestamp
            ? res.data.reviewerTimestamp
            : 0;
          let item = {};
          if (workerInspectTerm > reviewerInspectTerm) {
            item = res.data.workerInspectTerm;
          } else {
            item = res.data.reviewerInspectTerm;
          }
          this.radio1 = item[0].content.c1;
          this.radio2 = item[1].content.c2;
          this.radio3 = item[2].content.c3;
          this.radio4 = item[3].content.c4;
          this.radio5 = item[4].content.c5;
          this.radio6 = item[5].content.c6;
          this.radio7 = item[6].content.c7;
          this.radio8 = item[7].content.c8;
          this.radio9 = item[8].content.c9;
          this.radio10 = item[9].content.c10;
        } else if (item.type === "送机工作") {
          console.log(this.form);
          const workerInspectTerm = res.data?.inspectTimestamp
            ? res.data.inspectTimestamp
            : 0;
          const reviewerInspectTerm = res.data?.reviewerTimestamp
            ? res.data.reviewerTimestamp
            : 0;
          let item = {};
          if (workerInspectTerm > reviewerInspectTerm) {
            item = res.data.workerInspectTerm;
          } else {
            item = res.data.reviewerInspectTerm;
          }
          this.detailForm.c1 = item[0].content.c1;
          this.detailForm.c2 = item[0].content.c2;
          this.detailForm.c1other = item[0].content.c1other;
          this.detailForm.c2other = item[0].content.c2other;
          this.detailForm.boatNameInspect = item[1].content.boatNameInspect;
          this.detailForm.c3 = item[4].content.c3;
          this.detailForm.c2other = item[4].content.c3other;
          this.detailForm.d4 = item[7].content.d4;
          this.detailForm.c4 = item[8].content.c4;
          this.detailForm.c5 = item[8].content.c5;
          this.detailForm.c4other = item[8].content.c4other;
          this.detailForm.c5other = item[8].content.c5other;
        } else if (item.type === "维修检查") {
          const workerInspectTerm = res.data?.inspectTimestamp
            ? res.data.inspectTimestamp
            : 0;
          const reviewerInspectTerm = res.data?.reviewerTimestamp
            ? res.data.reviewerTimestamp
            : 0;
          let item = {};
          if (workerInspectTerm > reviewerInspectTerm) {
            item = res.data.workerInspectTerm;
          } else {
            item = res.data.reviewerInspectTerm;
          }
          this.detailForm.c1 = item[0].content.c1;
          this.detailForm.c2 = item[0].content.c2;
          this.detailForm.c1other = item[0].content.c1other;
          this.detailForm.c2other = item[0].content.c2other;
          this.detailForm.d1 = item[1].content.d1;
          this.detailForm.boatNameInspect = item[2].content.boatNameInspect;
          this.detailForm.d2 = item[3].content.d2;
          this.detailForm.d3 = item[4].content.d3;
          this.detailForm.c3 = item[5].content.c3;
          this.detailForm.c4 = item[5].content.c4;
          this.detailForm.c3other = item[5].content.c3other;
          this.detailForm.c4other = item[5].content.c4other;
        } else if (item.type === "接机工作") {
          console.log(this.form.workerInspectTerm);
          const workerInspectTerm = res.data?.inspectTimestamp
            ? res.data.inspectTimestamp
            : 0;
          const reviewerInspectTerm = res.data?.reviewerTimestamp
            ? res.data.reviewerTimestamp
            : 0;
          let item = {};
          if (workerInspectTerm > reviewerInspectTerm) {
            item = res.data.workerInspectTerm;
          } else {
            item = res.data.reviewerInspectTerm;
          }
          if (item) {
            this.detailForm.c1 = item[1].content.c1;
            this.detailForm.c2 = item[1].content.c2;
            this.detailForm.c1other = item[1].content.c1other;
            this.detailForm.c2other = item[1].content.c2other;
            this.detailForm.d1 = item[2].content.d1;
            this.detailForm.d2 = item[3].content.d2;
            this.detailForm.d3 = item[4].content.d3;
            this.detailForm.c3 = item[5].content.c3;
            this.detailForm.c4 = item[5].content.c4;
            this.detailForm.c3other = item[5].content.c3other;
            this.detailForm.c4other = item[5].content.c4other;

            let index = {};

            item.forEach((items) => {
              index[items.index] = items.index;
            });

            if (index["7"]) {
              this.index7 = true;
              this.detailForm.c5 = item[6].content.c5;
              this.detailForm.c6 = item[6].content.c6;
              if (item[6].content.c7) {
                const c7 = JSON.parse(item[6].content.c7);
                if (c7.length) {
                  this.detailForm.srcList = c7.map((item) => {
                    return this.minioPath + item.path;
                  });
                  this.detailForm.url = this.minioPath + c7[0].path;
                } else {
                  this.detailForm.srcList = [];
                  this.detailForm.url = "";
                }
              } else {
                this.detailForm.srcList = [];
                this.detailForm.url = "";
              }
            } else {
              this.index7 = false;
            }
          } else {
            this.detailForm = {};
          }
        }

        //工单类型、状态转换
        for (const i in this.form) {
          if (this.form.state === 1) {
            this.form.state = "待检查";
          }
          if (this.form.state === 2) {
            this.form.state = "待复核";
          }
          if (this.form.state === 3) {
            this.form.state = "已完成";
          }
          if (this.form.state === 4) {
            this.form.state = "废弃";
          }
          if (this.form.type === 1) {
            this.form.type = "接机工作";
          }
          if (this.form.type === 2) {
            this.form.type = "送机工作";
          }
          if (this.form.type === 3) {
            this.form.type = "维修检查";
          }
          if (this.form.type === 4) {
            this.form.type = "长短停及航后离机检查项目";
          }
        }
      });
      console.log(this.detailForm);
    },
    // 清空表单
    dialogClose(done) {
      this.dialogTitle = "";
      this.form = {};
      done();
    },
  },
};
</script>

<style lang="scss" scoped>
.header {
  display: flex;

  .prompt {
    display: flex;
    flex-direction: column;
    width: 50%;
    height: 100%;
    background-color: #3f8cda;
    color: white;
    border-radius: 15px;

    h1 {
      text-align: center;
      font-size: 30px;
      letter-spacing: 4px;
    }

    .prompt-main {
      display: flex;
      justify-content: center;

      .vertical-line {
        height: 60px;
        width: 1px;
        background-color: #7b8189;
      }

      .el-col {
        text-align: center;
      }

      .text1 {
        font-size: 30px;
        font-weight: 20px;
        color: #0fec76;
        margin: 5px 0;
      }

      .text2 {
        font-size: 30px;
        font-weight: 20px;
        color: #7a8014;
        margin: 5px 0;
      }

      .text3 {
        font-size: 30px;
        font-weight: 20px;
        color: #bac1d8;
        margin: 5px 0;
      }
    }
  }

  .el-form {
    margin-left: 10px;
    display: flex;
    flex-wrap: wrap;
    flex: 1;

    .el-form-item {
      .el-form-item__label {
        width: 100px;
      }
    }
  }

  .header-button {
  }
}
</style>
